import React from 'react';
import { observer, inject } from 'mobx-react';
import { WeaErrorPage,WeaTools, WeaLocaleProvider } from 'ecCom';
import {WeaTableNew} from 'comsMobx';
const WeaTable = WeaTableNew.WeaTable;
import * as _ from '../../util/common';
import '../../style/formResource.less';
import CommunicationRichText from './CommunicationRichText';
import ContentItem from './ContentItem';
import { message, Pagination} from 'antd';

const getLabel = WeaLocaleProvider.getLabel;

@observer
class ContentList extends React.Component {
 
    submit = (params, callback) => {
        const { logid } = this.props;
        let str = params.remark;
        if(params.remark != '' &&  params.remark.indexOf('<img') < 0) {
          str = params.remark.replace(/<\/?[^>]*>/g, '');
          str = str.replace(/[\u200B-\u200D\uFEFF]/g, "");
          str = str.replace(/\n/g,'');
          str = str.replace("&#8203;", "").replace(/&nbsp;/g, '');
          str = str.trim();
        } 
        if (!str) {
          message.error(getLabel(382648, '请输入交流内容'));
          return false;
        }
        const {logListStore} = this.props;
        if(params.replyType == "edit") {
          logListStore.editContent(params, logid, callback);
        } else {
          logListStore.saveReply(params, logid, callback);
        }
      }
      
      imgLoad = () => { //为了使用表单的图片预览工具，为相关交流的图片添加original-*属性，前提是交流后台没有将src做懒加载替换
        jQuery('.wea-workflow-communication-list').find('img').each(function() {
          jQuery(this).attr('original-src', jQuery(this).attr('src'));
          jQuery(this).attr("original-style", jQuery(this).attr("style"));
        })
        window.formImgLazyLoad && window.formImgLazyLoad(jQuery('.wea-workflow-communication-list'))
      }

      componentDidMount() {
        this.imgLoad();
      }
      
      componentDidUpdate(prevProps, prevState) {
        this.imgLoad();
      }

      render(){
        const { commentList = [],logListStore, logid, isFromPortal=false, isprint='0', hasSubmitRight= false } = this.props;
          return (
             <div>
               <div className={`wea-workflow-communication-list wea-workflow-communication-list-${logid}`}>
                  {
                      commentList.map((content,index) => {
                          return (
                            <ContentItem ecId={`${this && this.props && this.props.ecId || ''}_ContentItem@xvg6qh@${index}`} 
                                isFromPortal={isFromPortal}
                                appStatus={logListStore.appStatus} 
                                contentInfo={content} 
                                submit={this.submit} 
                                operate={logListStore.delContent}
                                logid={logid}
                                logParams={logListStore.logItemBaseParams}
                                isprint={isprint}
                                hasSubmitRight={hasSubmitRight}
                            />
                          )
                      })
                  }
               </div>
             </div>
          )
      }
}

export default WeaTools.tryCatch(React, 
    props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@iaakt6`} msg={ props.error ? props.error : getLabel(383324,'对不起，该页面异常，请联系管理员')} />,
    {error: ""}
)(ContentList);